```html
<template>
  <view class="container">
    <view class="header">
      <image class="avatar" :src="user.avatarUrl" @click="chooseImage"></image>
      <view class="name">{{user.nickname}}</view>
    </view>
    <view class="switch">
      <text class="label">修改</text>
    <switch class="value"  @change="changevalue"></switch>
    </view>
    <view class="info">
		<view class="item">
		  <text class="label">id</text>
		  <input class="value" v-model="user.id" :disabled="true"></input>
		</view>
		<view class="item">
		  <text class="label">用户创建时间</text>
		  <input class="value" v-model="user.createTime" :disabled="true"></input>
		</view>
		<view class="item">
		  <text class="label">昵称</text>
		  <input class="value" v-model="user.nickname" ></input>
		</view>
      <view class="item">
		<radio-group name="sex"  @change="radioChange">
					<text class="label">性别</text>
					<label >
						<radio class="sex" :disabled="!editable" value="MALE" checked="checked" /><text>男</text>	
						<radio calss="sex" :disabled="!editable" value="FEMALE" /><text>女</text>
					</label>
		</radio-group>
	
        
      </view>
      <view class="item">
        <text class="label">年龄</text>
        <input class="value" v-model="user.age" :disabled="!editable"></input>
      </view>
      <view class="item">
        <text class="label">简介</text>
        <input class="value" v-model="user.introduction" :disabled="!editable"></input>
      </view>
    </view>
    <button v-if="editable" class="submit" @click="submit">提交</button>
<!-- 	    <button  class="submit" @click="sendimage">获取头像凭证</button> -->
 <view class="copy-right">CopyRight 2023.07.26 gualiguali</view>
  </view>
  
</template>

<script>
export default {
	onLoad:function(options){
	      // 先接收上个页面传过来的参数  id和nama
	      console.log(options.id);
	      console.log(options.name);
		  console.log("进入个人详情界面")

		  uni.request({
		  	  	method:'GET',
		  	  	url:"http://47.97.114.13:8080/api/user/my",
		  	  	header: {
		  	  	    "Authorization": this.$store.state.token,
		  	  	  },
		  	  })				  
		  	  .then(res => {
				  console.log(res);
		  		  console.log(res[1].data.data);
				  //获取信息
				  this.user.id = res[1].data.data.id;
				  this.user.nickname = res[1].data.data.nickname;
				  this.user.avatarUrl = res[1].data.data.avatarUrl;
				  this.user.introduction = res[1].data.data.introduction;
				  this.user.gender = res[1].data.data.gender;
				  this.user.createTime = res[1].data.data.createTime;
		  	  })
	      },
		  onPullDownRefresh(){

		  	  console.log("刷新个人详情界面")
		  
		  	  uni.request({
		  	  	  	method:'GET',
		  	  	  	url:"http://47.97.114.13:8080/api/user/my",
		  	  	  	header: {
		  	  	  	    "Authorization": this.$store.state.token,
		  	  	  	  },
		  	  	  })				  
		  	  	  .then(res => {
		  			  console.log(res);
		  	  		  console.log(res[1].data.data);
		  			  //获取信息
		  			  this.user.id = res[1].data.data.id;
		  			  this.user.nickname = res[1].data.data.nickname;
		  			  this.user.avatarUrl = res[1].data.data.avatarUrl;
		  			  this.user.introduction = res[1].data.data.introduction;
		  			  this.user.gender = res[1].data.data.gender;
		  			  this.user.createTime = res[1].data.data.createTime;
		  	  	  })
				  uni.stopPullDownRefresh()
		        },

		  
	   

  data() {
    return {	
		imageRemoteURL:'',
		imageSrc: "",
		imageUploadInfo: {
		  	tmpSecretId: "",
		  	tmpSecretKey: "",
		  	sessionToken: "",
		  	uploadUrl: "",
			uploadPath: "",
		},
      user: {
		id:"",
        nickname: "未登录昵称",
        avatarUrl: "",
        introduction:'',
		gender: "未知性别",
        createTime:'未知时间',
      },
	  // gender{
		 //  {
			  
		 //  },
		 //  {
			  
		 //  },
		 //  {
			  
		 //  },
	  // },
      editable: false
    };
  },
  methods: {
	  chooseImage() {
	    uni.chooseImage({
	  	count: 1,
	      sourceType: ["album", "camera"],
	      success: res => {
	  
	        this.imageSrc = res.tempFilePaths[0];
	  	console.log("图片地址："+ this.imageSrc)
		this.getavatarUrl()
	      }
	    });
	  },
	  getavatarUrl(){
  //console.log("获取视频凭证");
  return new Promise((resolve, reject) => {
    // 
    uni.request({
      method: 'GET',
      url: "http://47.97.114.13:8080/api/user/avatar/credential",
      header: {
         "Authorization": this.$store.state.token,
		//"Authorization": "Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlIjoiQURNSU4iLCJpZCI6IjEiLCJleHAiOjE2OTA2MzQwNjF9.hLKol44b8oH1AmmRBnX3pbCcOXmv6YfJEjNkY72ujdA"
		//this.$store.state.token,
        // this.$store.state.token,
      },
      data: {
        filename: new Date().toISOString()
      },
      success: (res) => {
        console.log("获取头像凭证");
		//console.log(res);
        this.imageUploadInfo = res.data.data;
        
        resolve();
      },
      fail: (err) => {
        reject(err);
      }
    });
  })
  .then(() => {
	 // console.log(this.videoUploadInfo);
    this.uploadimage(this.imageUploadInfo.tmpSecretId, this.imageUploadInfo.tmpSecretKey, this.imageUploadInfo.sessionToken, this.imageUploadInfo.uploadUrl, this.imageUploadInfo.uploadPath, this.imageSrc);
	 // return this.pushData(); // 返回pushData的Promise结果
    })
  .catch((err) => {
    console.error(err);
  });

},
    sendimage(){
		this.uploadimage(this.imageUploadInfo.tmpSecretId, this.imageUploadInfo.tmpSecretKey, this.imageUploadInfo.sessionToken, this.imageUploadInfo.uploadUrl, this.imageUploadInfo.uploadPath, this.imageSrc);
	},
	
	async pushData() {
		
	  return new Promise(async (resolve, reject) => {
	    // if (this.videoSrc && this.imageSrc && this.title && this.desc) {
	    if (true) {
	      // uni.showToast({
	      //   title: "正在发布",
	      //   icon: "none"
	      // });
	
	      //上传image
	      if (true) {
			  console.log("上传image")
	        await this.uploadimage(this.imageUploadInfo.tmpSecretId, this.imageUploadInfo.tmpSecretKey, this.imageUploadInfo.sessionToken, this.imageUploadInfo.uploadUrl, this.imageUploadInfo.uploadPath, this.imageSrc);
	       // await this.uploadvideo(this.videoUploadInfo.tmpSecretId, this.videoUploadInfo.tmpSecretKey, this.videoUploadInfo.sessionToken, this.videoUploadInfo.uploadUrl, this.videoUploadInfo.uploadPath, this.videoSrc);
	      }
	
	      resolve(); // 表示前面的操作已完成
	    } else {
	      uni.showToast({
	        title: "请填写完整信息",
	        icon: "none"
	      });
	      reject(new Error("信息不完整")); // 如果信息不完整，则返回错误
	    }
	  })
	  .then(() => {
	    return new Promise((resolve, reject) => {
	    //  this.reportURL()
		})
	  })
	  .catch((err) => {
	    console.error(err);
	  });
	},
	
	uploadimage(tmpSecretId, tmpSecretKey, sessionToken, uploadUrl, uploadPath, file_path) {
	  return new Promise((resolve, reject) => {
		var COS = require('cos-wx-sdk-v5');
		let that = this;
		let cosf = new COS({
		  SecretId: tmpSecretId,
		  SecretKey: tmpSecretKey,
		  SecurityToken: sessionToken
		});
	
		console.log("图片地址：" + file_path);
		cosf.postObject({
		  Bucket: 'gualiguali-1308905817',
		  Region: 'ap-beijing',
		  Key: uploadPath + "/.jpg",
		  FilePath: file_path,
		}, function(err, data) {
		  if (err) {
			console.error(err);
			reject(err);
		  } else {
			console.log('function ---->', err || data);
			that.imageRemoteURL = 'https://'+data.Location;
			console.log(that.imageRemoteURL);
			resolve();
		  }
		});
	  });
	},
	
	
	  ///提交修改
    submit() {
		console.log("提交修改")
		uni.request({
			  	method:'PUT',
				url:"http://47.97.114.13:8080/api/user/my",
				header: {
				    "Authorization": this.$store.state.token,
				  },
				data:{
					nickname:this.user.nickname,
					avatarUrl:this.imageRemoteURL,
					introduction:this.user.introduction,
					gender:this.user.gender,
				},
			  })
			  .then(res => {
			  		  console.log(res);
			  		  if(res[1].data.success === true)
			  		  {
			  			  uni.showToast({
			  			    title: "提交成功",
			  			    icon: "success"
			  			  });
			  		  }
					  else{
						  uni.showModal({
						  				title: "提示",
						  				content: "修改失败："+res[1].data.message,
						  				showCancel:false,
						  				success: function (res) {
						  					if (res.confirm) {
						  						console.log('用户点击确定');
						  					} else if (res.cancel) {
						  						console.log('用户点击取消');
						  					}
						  				}
						  			});
					  }

			  	  })
    },
	changevalue()
	{
			  if(this.editable === false)
			  {
				  this.editable = true
			  }
			  else{
				   this.editable = false
			  }
	},
	radioChange: function(evt) {
		this.user.gender=evt.detail.value;
		},

  }
};
</script>

<style>
.container {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-end;
		width: 100%;
		background-color: #ffffff;
}
.header {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20rpx;
}
.avatar {
  width: 200rpx;
  height: 200rpx;
  border-radius: 100rpx;
}
.name {
  font-size: 36rpx;
  font-weight: bold;
  margin-top: 10rpx;
}
.switch {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  height: 80rpx;
  padding-left: 20rpx;
  padding-right: 20rpx;
  background-color: #ffffff;
}
.info {
  display: flex;
  flex-direction: column;
  width: 80%;
}
.item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 80rpx;
  padding-left: 20rpx;
  padding-right: 20rpx;
  background-color: #ffffff;
}
.label {
  font-size: 28rpx;
}
.value {
  font-size: 28rpx;
}
.submit {
   width:80%;
   height:80rpx; 
   margin-top :20rpx; 
   background-color:#1aad19; 
   color:#ffffff; 
   border-radius :10rpx; 
   font-size :32rpx; 
   text-align :center; 
   line-height :80rpx
   
}
		.copy-right {
			// bottom: 100rpx;
			bottom: 0;
			width: 100%;
			color: $uni-text-color-grey;
			text-align: center;
			font-size: 24rpx;
		}
.sex{
	fonsize:28rpx;
	margin-left: 180rpx;
}
</style>
```